<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
		<title>手机绑定</title>
		<link href="__ROOT__/public/xiaoniao/css/public.css" rel="stylesheet" type="text/css">
		<link rel="stylesheet" href="__ROOT__/public/xiaoniao/css/bangding.css" type="text/css"/>
		<link rel="stylesheet" href="__ROOT__/public/xiaoniao/css/icon.css" type="text/css"/>
		<link rel="stylesheet" type="text/css" href="__ROOT__/public/webapp/css/valide.css"/>
		<link rel="stylesheet" type="text/css" href="__ROOT__/public/webapp/css/s_valide.css"/>
		<script type="text/javascript" src="__ROOT__/public/webapp/js/jquery-1.8.3.min.js"></script>
		<script src="__ROOT__/public/webapp/js/Validform_v5.3.2_min.js" type="text/javascript" charset="utf-8"></script>
		<script type="text/javascript" src="__ROOT__/public/webapp/js/common.js"></script>
	</head>
	<style>
        #footer{left: 0;}
    </style>
	<body>
		<form id="form" action="" method="post">
		<!--头部-->
		<div id="header">
		<ul>
			
			<!--第一个bar的隐藏提交-->
            <input type="text" name="type" hidden value="" class="type">
            <!--第二个bar的隐藏提交-->
            <input type="text" name="lei"  hidden value="" class="lei">
			
			
			<li>
				<p><svg class="icon" aria-hidden="true" style="color:#f86d6d;font-size: 24px;">
  <use xlink:href="#icon-kehudianhua"></use></svg><span>手机号</span></p><input type="tel" placeholder="请输入手机号" name="phone" class="defcon_input phone_code" id="userName"  datatype="phone" nullmsg="请输入手机号！"/><em id="zhi"></em>
			</li>
			<li>
				<p><svg class="icon" aria-hidden="true" style="color:#f86d6d;font-size: 24px;">
  <use xlink:href="#icon-anquan2"></use></svg><span>验证码</span></p><input type="number" class="code_input" placeholder="请输入验证码" name="code" datatype="*" nullmsg="请输入正确的短信验证码！"/><a href="#" class="fs code_r huoqucode">发送验证码</a>
			</li>
		</ul>	
		
		</div>
		<!--头部结尾-->
		<input type="submit" id="footer" value="确定">
				
	</form>	
	<div class="alertMsg">
    	<span></span>
    </div>
	</body>
</html>
<script type="text/javascript" src="__ROOT__/public/xiaoniao/js/com.js" ></script>
<script type="text/javascript" src="__ROOT__/public/xiaoniao/js/iconfontg.js" ></script>
<!--<script type="text/javascript" src="__ROOT__/public/xiaoniao/js/bangding.js" ></script>-->
<script>
//验证码
        fsTime.init({
            class:".huoqucode",
            input:".phone_code",
            code:".code_input",
            num:60
        });
    //			表单验证
      
				$.Tipmsg.r=null;
			var showmsg=function(msg){
				toggleAlert(msg);
			};
			//		message
			var toggleAlert=function(msg){
	    		$(".alertMsg").addClass("on").find("span").html(msg);
	    		setTimeout(function(){
	    			$(".alertMsg").removeClass("on");
	    		},1000);
	    	};
			
			$("#form").Validform({
				datatype:{
					"phone":function(gets,obj,curform,regxp){
						/*参数gets是获取到的表单元素值，
						  obj为当前表单元素，
						  curform为当前验证的表单，
						  regxp为内置的一些正则表达式的引用。*/
		
						var reg1=/^1(3|4|5|7|8)[0-9]\d{8}$/,
							reg2=/^1(3|4|5|7|8)[0-9]\d{8}$/,
							mobile=curform.find(".mobile");
						
						if(reg1.test(mobile.val())){return true;}
						if(reg2.test(gets)){return true;}
						
						return false;
					},
				},
				ajaxPost:false,
				tiptype:function(msg){
					showmsg(msg);
				},
				tipSweep:true,
			});
</script>